extends layout/default

block content
    script.
        var __hn = '#{hotelNo}';
    #page-main.page
        header.bar.bar-nav
            h1.title 房间列表
            .search-cond

        include ./include/nav

        .content
            #hotel-list
                each room in roomList
                    .card.js-room-card(data-type-code='#{room.rtCode}', data-type-name='#{room.rtName}',data-price='#{room.price}' data-room-count='#{room.rmSize}')
                        .card-header.width-100
                            span #{room.rtName}
                            a 还有#{room.rmSize}间
                        .card-content
                            .list-block.media-list
                                ul
                                    li.item-link.item-content
                                        .item-media
                                            img(src="#{room.rtImg}", width="100")
                                        .item-inner
                                            .item-title-row
                                                .item-title #{room.price}元
                                            .item-subtitle &#21830;&#21153;&#22823;&#24202;&#25151;&#38750;&#24120;&#30340;&#21830;&#21153;
                        .card-footer
                            span.button.button-fill.width-100.js-booking-btn &#39532;&#19978;&#39044;&#35746;

    #page-order.page
        header.bar.bar-nav
            a.button.button-link.button-nav.pull-left.back(href="#page-main")
                span.icon.icon-left
                | 返回
            h1.title 订单详情
        nav.bar.bar-tab
            .tab-item
                a#submit-order.button.button-fill.button-big.width-100( style="border-radius: 0") 确定订单
        .content
            .list-block(style='margin-top:.25rem')
                ul
                    li.item-content
                        .item-inner
                            .item-title 预订酒店
                            .item-after #{hotel.hoHotelname}
                    li.item-content
                        .item-inner
                            .item-title &#39044;&#35746;&#25151;&#22411;
                            .item-after#order-room-type - - -
                    li.item-content
                        .item-inner
                            .item-title 预订房数
                            .item-after#order-room-number
                                span.mr-10.fs-l#room-down(style="line-height: 1")  -
                                input#order-room-count(type="text", value="1", style="height: auto;width: 60px;text-align: center")
                                span.ml-10.fs-l#room-up(style="line-height: 1")  +
                    li.item-content
                        .item-inner
                            .item-title 预到日期
                            .item-after#start-date #{startDate}
                    li.item-content
                        .item-inner
                            .item-title 预离日期
                            .item-after#end-date #{endDate}
                    li.item-content
                        .item-inner
                            .item-title 金额
                            .item-after
                                span.color-warning#order-money - - -
                                | 元
            .list-block
                ul
                    li
                        .item-content
                            .item-inner
                                .item-title.label 联系人
                                .item-input
                                    input#input-username(type="text", placeholder="您的姓名" value='#{linkMan}')
                    li
                        .item-content
                            .item-inner
                                .item-title.label 手机号
                                .item-input
                                    input#input-phone(type="number", placeholder="您的手机" value='#{phone}')
                    li
                        .item-content
                            .item-inner
                                .item-title.label 验证码
                                .item-input
                                    input#input-yzm(type="number", placeholder="验证码")
                                .item-after
                                    a.js-get-yzm(data-url="/yzm?hn=#{hotelNo}", data-count="60", data-target-phone-number="#input-phone") 获取验证码
                    li
                        .item-content
                            .item-inner
                                .item-title.label 备注
                                .item-input
                                    textarea#input-remark
        // end of content
    #page-order-success.page
        header.bar.bar-nav
            h1.title 约定成功

        include include/nav

        .content
            .content-block-title(style="margin-top: .75rem") &#35746;&#21333;&#35814;&#24773;
            .list-block(style="margin: 0")
                ul
                    li.order-info-item
                        .item-key 订单编号:
                        .item-value.js-s-order-num - - -
                    li.order-info-item
                        .item-key 预订酒店:
                        .item-value.js-s-hotel-name #{hotel.hoHotelname}
                    li.order-info-item
                        .item-key 预订房型:
                        .item-value.js-s-room-type
                    li.order-info-item
                        .item-key 入住时间:
                        .item-value.js-s-in-time
                    li.order-info-item
                        .item-key 下单时间:
                        .item-value.js-s-order-time
            .content-block-title(style="margin-top: .75rem") 客户信息
            .list-block
                ul
                    li.order-info-item
                        .item-key 联系人:
                        .item-value.js-s-link-man
                    li.order-info-item
                        .item-key 联系电话
                        .item-value.js-s-phone
            .content-padded
                a.button.button-fill 支付
            .content-padded
                a.button.button-fill.js-select-room 选房
            .content-padded
                a.button.button-fill.js-cancel-order 取消订单
        // end of content

    #page-select-room.page
        header.bar.bar-nav
            a.button.button-link.button-nav.pull-left.back(href="#page-order-success")
                span.icon.icon-left 返回
            h1.title 选房

        nav.bar.bar-tab
            .tab-item
                a#submit-select-room.button.button-fill.button-big.width-100( style="border-radius: 0") 确定选房

        .content
            .content-block-title#select-room-count(style="margin-top: .75rem") 选择房间
            .list-block(style="margin: 0")
                ul#select-room-list


block pageJs
    script(src=getStatic("ubooking/booking/booking.entry.js") )

block pageCss
    link(rel='stylesheet' href=getStatic('ubooking/booking/booking.entry.css'))






